<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page import="xyz.vmcserver.wdibbs.model.vo.User" %><%--
  Created by IntelliJ IDEA.
  User: 11382
  Date: 2022/5/15
  Time: 8:56
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <style>
        .col-8{
            background-color: #0dcaf0;
            border: 0 solid rgba(11, 94, 215, 0.75);
            border-radius: 0.9em;
        }
        .card{
            width: 100%;
            text-align: center;
        }
        .rightBar{
            position: fixed;
            top: 73px;
        }
        .card-img-top{
            /*width: 50px;*/
            height: 230px;
        }
    </style>
</head>
<body>
<%--导入依赖--%>
<jsp:include page="/WEB-INF/pages/module/head.jsp">
    <jsp:param name="title_2" value="用户主页"/>
</jsp:include>
<%--导入导航栏--%>
<jsp:include page="/WEB-INF/pages/module/navbar.jsp"/>
<div class="container">
    <div class="row">
<%--        <div class="col-1"></div>--%>
        <div class="col-8 shadow p-3 mb-5 bg-body rounded">
                <div class="new-article-group">
                    <a href="#" class="list-group-item list-group-item-action active" aria-current="true">
                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-bell" viewBox="0 0 16 16">
                            <path d="M8 16a2 2 0 0 0 2-2H6a2 2 0 0 0 2 2zM8 1.918l-.797.161A4.002 4.002 0 0 0 4 6c0 .628-.134 2.197-.459 3.742-.16.767-.376 1.566-.663 2.258h10.244c-.287-.692-.502-1.49-.663-2.258C12.134 8.197 12 6.628 12 6a4.002 4.002 0 0 0-3.203-3.92L8 1.917zM14.22 12c.223.447.481.801.78 1H1c.299-.199.557-.553.78-1C2.68 10.2 3 6.88 3 6c0-2.42 1.72-4.44 4.005-4.901a1 1 0 1 1 1.99 0A5.002 5.002 0 0 1 13 6c0 .88.32 4.2 1.22 6z"></path>
                        </svg>
                        最新发布
                    </a>
                    <c:forEach items="${latestArticles}" var="la">
                        <a href="/article/${la.content}" class="list-group-item list-group-item-action">
                            [
                            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-easel" viewBox="0 0 16 16">
                                <path d="M8 0a.5.5 0 0 1 .473.337L9.046 2H14a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1h-1.85l1.323 3.837a.5.5 0 1 1-.946.326L11.092 11H8.5v3a.5.5 0 0 1-1 0v-3H4.908l-1.435 4.163a.5.5 0 1 1-.946-.326L3.85 11H2a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h4.954L7.527.337A.5.5 0 0 1 8 0zM2 3v7h12V3H2z"></path>
                            </svg>
                                ${la.type}
                            ]&nbsp;&nbsp;&nbsp;
                            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-chat-square-dots" viewBox="0 0 16 16">
                                <path d="M14 1a1 1 0 0 1 1 1v8a1 1 0 0 1-1 1h-2.5a2 2 0 0 0-1.6.8L8 14.333 6.1 11.8a2 2 0 0 0-1.6-.8H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h2.5a1 1 0 0 1 .8.4l1.9 2.533a1 1 0 0 0 1.6 0l1.9-2.533a1 1 0 0 1 .8-.4H14a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"></path>
                                <path d="M5 6a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm4 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm4 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0z"></path>
                            </svg>
                                ${la.title}&nbsp;&nbsp;&nbsp;
                            @${la.creator}
                            <div class="time" style="float: right">
                                    ${la.createTime}
                            </div>
                        </a>
                    </c:forEach>
<%--                    <div style="float: right">当前第&nbsp;<div id="pageNum" style="display: inline-block">1</div>&nbsp;页</div>--%>
                        <nav aria-label="Page navigation example">
                            <ul class="pagination justify-content-center">
                                <li class="page-item"><a class="page-link" href="#">1</a></li>
                                <li class="page-item"><a class="page-link" href="#">2</a></li>
                                <li class="page-item"><a class="page-link" href="#">3</a></li>
                            </ul>
                        </nav>
                </div>
        </div>
        <div class="col-4">
            <div class="rightBar">
            <%if(null==session.getAttribute("permission")){%>
            <div class="card">
                <div class="card-body">
                <img src="/static/img/welcome.png" class="card-img-top">
<%--                <div class="card-body">--%>
                    <h3 class="card-title">欢迎来到微梦岛BBS</h3>
                    <p class="card-text">
                    <p>嗨，你好！很高兴认识你，不过你看起来还没有登录?</p>
                    <p>未登录的状态下，你将以游客身份浏览网页。</p>
                    <p>你对大部分板块的访问和帖子的阅读将受到限制。</p>
                    <p>所以，要不要尝试注册或者登录下?</p>
                    </p>
                    <a href="${pageContext.request.contextPath}/user/register" class="btn btn-primary">加入微梦岛会员</a>
                    <a href="${pageContext.request.contextPath}/user/login" class="btn btn-primary">以会员身份登录</a>
<%--                </div>--%>
            </div>
                </div>
            <%}else{
                User user = (User) session.getAttribute("isLoginUser");

          %>
            <div class="card">
                <div class="card-body">
                    <img width="100x" height=100px src="/userHeader/<%=user.getHeader_url()%>" class="rounded-circle">
                    <h3 class="card-title">欢迎你，<%=user.getAlias()%>!</h3>
                    <p class="card-text">
                            <%
                            int ratio;
                            if(user.getScore()>96296){
                                ratio=100;
                            }else{
                                ratio= user.getScore()/96296;
                            }
                            if (ratio==0&&user.getScore()!=0){
                                ratio=1;
                            }
                            %>
    <p>当前用户组：<%=user.getGroup_alias()%>(<a href="${pageContext.request.contextPath}/user/groupInfo">点此查看用户组信息</a>)</p>
                    <p>积分进度：
                    <div class="progress">
                        <div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow="<%=ratio%>" aria-valuemin="0" aria-valuemax="100" style="width: <%=ratio%>%">
                           <%=ratio%>%
                        </div>
                    </div>
                    <p>(<%=user.getScore()%>/96296)</p>
                    </p>
                    </p>
                    <a href="${pageContext.request.contextPath}/user/logout" class="btn btn-danger">注销登录</a>

                </div>
            </div>
                <a class="btn btn-primary" href="${pageContext.request.contextPath}/createArticle" role="button" style="width: 100%">
                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-send-fill" viewBox="0 0 16 16">
                        <path d="M15.964.686a.5.5 0 0 0-.65-.65L.767 5.855H.766l-.452.18a.5.5 0 0 0-.082.887l.41.26.001.002 4.995 3.178 3.178 4.995.002.002.26.41a.5.5 0 0 0 .886-.083l6-15Zm-1.833 1.89L6.637 10.07l-.215-.338a.5.5 0 0 0-.154-.154l-.338-.215 7.494-7.494 1.178-.471-.47 1.178Z"></path>
                    </svg>
                    立即发帖
                </a>
            <%}%>
        </div>
        </div>
    </div>
</div>
<script>
    $(function (){
        $(".pagination.justify-content-center").children().click(function (){
            if($(this).text()!="&laquo;"&&$(this).text()!="&raquo;"){
                window.location.href = "${pageContext.request.contextPath}/home?page="+$(this).text();
            }
            // alert($(this).text()+"||"+$("#pageNum").text())
        });
    });
</script>
</body>
</html>
